<template>
  <div @click="cliEve">{{ name }}</div>
  <p>年龄：{{ age }}</p>
  <p v-if="play">子组件传过来的值：{{ play }}</p>
  <SonPage :ming="name" @sendToy="saveToy"></SonPage>
  <SonPage2></SonPage2>
</template>
<script>
import SonPage from './SonPage.vue'
import SonPage2 from './SonPage2.vue'
import { defineComponent, reactive, toRefs } from 'vue'
export default defineComponent({
  name: 'DemoTemplate',
  components: { SonPage ,SonPage2},
  setup() {
    const state = reactive({
      name: '李白',
      play: '',
    })

    const sex = '男'
    const age = 22
    const cliEve = () => {
      state.name += '-' + sex
    }
    function saveToy(val) {
      state.play = val
      console.log('收到的值', val)
    }
    return {
      ...toRefs(state),
      saveToy,
      cliEve,
      age,
    }
  },
})
</script>
